<!DOCTYPE html>
<html lang="en" >

<head>
<meta charset="UTF-8">
<title>CSS Loading Animations</title>



<link rel="stylesheet" href="css/style.css">


</head>

<body>

  <div class="spinner-box">
  <div class="circle-border">
    <div class="circle-core"></div>
  </div>  
</div>

<div class="spinner-box">
  <div class="configure-border-1">  
    <div class="configure-core"></div>
  </div>  
  <div class="configure-border-2">
    <div class="configure-core"></div>
  </div> 
</div>

<div class="spinner-box">
  <div class="pulse-container">  
    <div class="pulse-bubble pulse-bubble-1"></div>
    <div class="pulse-bubble pulse-bubble-2"></div>
    <div class="pulse-bubble pulse-bubble-3"></div>
  </div>
</div>


<div class="spinner-box">
  <div class="solar-system">
    <div class="earth-orbit orbit">
      <div class="planet earth"></div>
      <div class="venus-orbit orbit">
        <div class="planet venus"></div>
        <div class="mercury-orbit orbit">
          <div class="planet mercury"></div>
          <div class="sun"></div>
        </div>
      </div>
    </div>
  </div>
</div>
  
  

</body>

</html>
